<template>
  <div class="app-container">
    <div class="app-container-left">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            v-if="showTransferCluePool == 1"
            @click="transferCluePool"
            v-hasPermi="['crm:clue:transfercluepool']"
          >线索池</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            v-if="showTransferCustomer == 1"
            @click="transferToCustomer"
            v-hasPermi="['crm:clue:transfercustomer']"
          >转客户</el-button>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col  :span="20">
          <div class="company_name_detail">
            <span class="text-comname">{{ companyDetail.name }}</span></div>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <div class="flex-row align-center mb-13">
            <span class="el-icon-postcard"></span>
            <span class="text-info">所属部门: </span>
            <span>{{ companyDetail.deptName }}</span>
          </div>
        </el-col>
        <el-col :span="10">
          <div class="flex-row align-center mb-13">
            <span class="el-icon-postcard"></span>
            <span class="text-info">最新跟进时间: </span>
            <span>{{ companyDetail.realityFollowRecords }}</span>
          </div>
        </el-col>
        <el-col :span="10">
          <div class="flex-row align-center mb-13">
            <span class="el-icon-postcard"></span>
            <span class="text-info">下次跟进时间: </span>
            <span>{{ companyDetail.nextFollowTime }}</span>
          </div>
        </el-col>
      </el-row>
      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="线索信息" name="first">
          <el-divider content-position="left">基本信息</el-divider>
          <el-row :gutter="20">
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">姓名: </span>
                <span>{{ companyDetail.name }}</span>
              </div>
            </el-col>
          </el-row>
          <el-divider content-position="left">联系信息</el-divider>
          <el-row :gutter="20">
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">电话: </span>
                <span>{{ companyDetail.phone }}</span>
              </div>
            </el-col>
          </el-row>
          <el-divider content-position="left">其他信息</el-divider>
          <el-row :gutter="20">
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">跟进状态: </span>
                <span>{{ companyDetail.followStatus }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">线索来源: </span>
                <span>{{ companyDetail.cluesSources }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">下次跟进时间: </span>
                <span>{{ companyDetail.nextFollowTime }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">备注信息: </span>
                <span>{{ companyDetail.latestFollowRecords }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">渠道: </span>
                <span>{{ companyDetail.channel }}</span>
              </div>
            </el-col>
          </el-row>
          <el-divider content-position="left">系统信息</el-divider>
          <el-row :gutter="20">
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">负责人: </span>
                <span>{{ companyDetail.head }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">所属部门: </span>
                <span>{{ companyDetail.deptName }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">前负责人: </span>
                <span>{{ companyDetail.formerHead }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">前所属部门: </span>
                <span>{{ companyDetail.formerDeptName }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">创建人: </span>
                <span>{{ companyDetail.createBy }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">更新人: </span>
                <span>{{ companyDetail.updateBy }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">创建时间: </span>
                <span>{{ companyDetail.createTime }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">更新时间: </span>
                <span>{{ companyDetail.updateTime }}</span>
              </div>
            </el-col>
            <el-col :span="10">
              <div class="flex-row align-center mb-13">
                <span class="el-icon-postcard"></span>
                <span class="text-info">转客户时间: </span>
                <span>{{ companyDetail.transferCustomerTime }}</span>
              </div>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="电销流水" name="second">
          <el-table v-loading="loading" :data="electricAalesFlowList">
            <el-table-column type="index" :index="electricAalesFlowIndex"  label="序号" align="center" width="50"></el-table-column>
            <el-table-column label="跟进时间" align="center" prop="createTime">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="跟进内容" align="left" prop="followContent"/>
            <el-table-column label="跟进人" align="center" prop="createBy"/>
          </el-table>
          <pagination
            v-show="electricAalesFlowTotal>0"
            :total="electricAalesFlowTotal"
            :page.sync="getElectricAalesFlowList.pageNum"
            :limit.sync="getElectricAalesFlowList.pageSize"
            :page-sizes="[ 20, 50, 100]"
            @pagination="pbSel(activeName)"
          />
        </el-tab-pane>
        <!-- <el-tab-pane label="任务" name="third">
          <el-table v-loading="loading" :data="operateLogList">
            <el-table-column label="序号" type="index" :index="newId" align="center" prop="newId"/>
            <el-table-column label="序号" align="center" prop="id"/>
            <el-table-column label="上传人" align="center" prop="comName"/>
            <el-table-column label="文件名称" align="center" prop="comName">
              <template slot-scope="scope">
                <div @click="fileOpen(scope.row)" style="color: #00a2ff;cursor:pointer;">{{ scope.row.comName }}</div>
              </template>
            </el-table-column>
            <el-table-column label="上传时间" align="center" prop="regTime">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.regTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="pagingFileTotal>0"
            :total="pagingFileTotal"
            :page-sizes="[ 5, 10, 15]"
            :page.sync="pagingFile.pageNum"
            :limit.sync="pagingFile.pageSize"
            @pagination="pbSel(activeName)"
          />
        </el-tab-pane>
        <el-tab-pane label="附件" name="four">
          <el-table v-loading="loading" :data="operateLogList">
            <el-table-column label="序号" type="index" :index="newId" align="center" prop="newId"/>
            <el-table-column label="序号" align="center" prop="id"/>
            <el-table-column label="上传人" align="center" prop="comName"/>
            <el-table-column label="文件名称" align="center" prop="comName">
              <template slot-scope="scope">
                <div @click="fileOpen(scope.row)" style="color: #00a2ff;cursor:pointer;">{{ scope.row.comName }}</div>
              </template>
            </el-table-column>
            <el-table-column label="上传时间" align="center" prop="regTime">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.regTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="pagingFileTotal>0"
            :total="pagingFileTotal"
            :page-sizes="[ 5, 10, 15]"
            :page.sync="pagingFile.pageNum"
            :limit.sync="pagingFile.pageSize"
            @pagination="pbSel(activeName)"
          />
        </el-tab-pane> -->
        <el-tab-pane label="操作日志 " name="five">
          <el-table v-loading="loading" :data="operateLogList">
            <el-table-column type="index" :index="operateLogIndex"  label="序号" align="center" width="50"></el-table-column>
            <el-table-column label="跟进时间" align="center" prop="createTime">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="跟进内容" align="left" prop="followContent"/>
            <el-table-column label="跟进人" align="center" prop="createBy"/>
          </el-table>
          <pagination
            v-show="operateLogTotal>0"
            :total="operateLogTotal"
            :page-sizes="[ 20, 40, 60]"
            :page.sync="getOperateLogList.pageNum"
            :limit.sync="getOperateLogList.pageSize"
            @pagination="pbSel(activeName)"
          />
        </el-tab-pane>
      </el-tabs>
    </div>
    <div class="app-container-right">
      <Timeline 
        :title="title" 
        :data-list="dataList"
        :show-weather="showWeather">
      </Timeline>
    </div>

    <!-- 添加或修改CRM线索对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="客户名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入客户名称" />
        </el-form-item>
        <el-form-item label="公司名称" prop="comName">
          <el-input v-model="form.comName" placeholder="请输入公司名称" />
        </el-form-item>        
        <el-form-item label="客户类型" prop="type">
          <el-select
            v-model="form.type"
            placeholder="请选择客户类型"
            size="mini"
            @change="selectMethodType"
          >
            <el-option
              v-for="(item, index) in customerTypeData"
              :key="index"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>        
        <el-form-item label="手机" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入手机" />
        </el-form-item>
        <el-form-item label="跟进状态" prop="followStatus">
          <el-select
            v-model="form.followStatus"
            placeholder="请选择跟进状态"
            size="mini"
            @change="selectMethodFollowStatus"
          >
            <el-option
              v-for="(item, index) in customerfollowstatusData"
              :key="index"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户来源" prop="customerSources">
          <el-select
            v-model="form.customerSources"
            placeholder="请选择客户来源"
            size="mini"
            @change="selectMethodCustomerSources"
          >
            <el-option
              v-for="(item, index) in customersourcesData"
              :key="index"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所属行业" prop="industry">
          <el-select
            v-model="form.industry"
            placeholder="请选择所属行业"
            size="mini"
            @change="selectMethodIndustry"
          >
            <el-option
              v-for="(item, index) in customerindustryData"
              :key="index"
              :label="item.name"
              :value="item.name"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listCompany, getClue, delCompany, addCompany, updateCompany, getClueBaseInfo, getListElectricAalesFlowList, getListOperateLogList, getManage, transferClueToCustomer, transferClueToCluePool } from "@/api/crm/clue";
import { clueTransferCustomer, getCustomerByNameAndPhone } from "@/api/crm/customer";
import { getCluePoolByNameAndPhone } from "@/api/crm/cluePool";
import { getDicts } from "@/api/system/dict/data";
import Timeline from '@/components/TimeLine';
export default {
  name: "JobLog",
  components: {
    Timeline
  },
  dicts: ['sys_common_status', 'sys_job_group'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 按钮loading
      buttonLoading: false,
      // 选中数组
      ids: [],
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 调度日志表格数据
      jobLogList: [],
      showTransferCluePool: 1,
      showTransferCustomer: 1,
      customerLabelData: [],
      customerfollowstatusData: [],
      customerTypeData: [],
      customersourcesData: [],
      customerindustryData: [],
      title: "",
      // 是否显示弹出层
      open: false,
      // 日期范围
      dateRange: [],
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        id: [
          { required: true, message: "主键id不能为空", trigger: "blur" }
        ],
        name: [
          { required: true, message: "客户名称不能为空", trigger: "blur" }
        ],
        comName: [
          { required: true, message: "公司名称不能为空", trigger: "blur" }
        ],
        type: [
          { required: true, message: "客户类型不能为空", trigger: "blur"}
        ],
        phone: [
          { required: true, message: "手机不能为空", trigger: "blur" }
        ],
        industry: [
          { required: true, message: "所属行业不能为空", trigger: "blur" }
        ],
        followStatus: [
          { required: true, message: "跟进状态不能为空", trigger: "change" }
        ],
        customerSources: [
          { required: true, message: "客户来源不能为空", trigger: "blur"}
        ]
      },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        jobName: undefined,
        jobGroup: undefined,
        status: undefined
      },
      title: '线索动态',
      showWeather: true,
      dataList: [],
      companyDetail: {
        id : undefined,
        name : undefined,
        comName : undefined,
        phone : undefined,
        followStatus : undefined,
        cluesSources : undefined,
        head : undefined,
        deptId : undefined,
        deptName : undefined,
        formerHead : undefined,
        formerDeptId : undefined,
        formerDeptName : undefined,
        latestFollowRecords : undefined,
        realityFollowRecords : undefined,
        notFollowDays : undefined,
        nextFollowTime : undefined,
        channel : undefined,
        transferCustomerTime : undefined,
        lastCallTime : undefined,
        createBy : undefined,
        createTime : undefined,
        updateBy : undefined,
        updateTime : undefined,
      },
      activeName: 'first',
      manageForm: null,
      // 线索基本信息
      getClueInfo: {
        pageNum: 1,
        pageSize: 5,
      },
      //电销流水 sales_flow
      electricAalesFlowTotal: 0,
      getElectricAalesFlowList: {
        pageNum: 1,
        pageSize: 20,
      },
      electricAalesFlowList:[],
      //操作日志
      operateLogTotal: 0,
      getOperateLogList: {
        pageNum: 1,
        pageSize: 5,
      },
      operateLogList:[],
      //项目文件分页
      pagingFileTotal: 0,
      pagingFile: {
        pageNum: 1,
        pageSize: 5,
      },
      id:'',
      newId:0
    };
  },
  created() {
    const clueId = this.$route.query.clueId;
    this.buildClueBase(clueId);
    this.getBusinessDicts();
  },
  methods: {
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.handleQuery();
    },
    handleClick(tab) {
      console.info(this.companyDetail.id);
      console.info(tab.name);
      this.pbSel(tab.name)
    },
    buildClueBase(clueId){
      console.info(clueId)
      if (clueId !== undefined && clueId != 0) {
        getClue(clueId).then(response => {
          this.global = response.data.id;
          this.companyDetail.id = response.data.id;
          this.companyDetail.name = response.data.name;
          this.companyDetail.phone = response.data.phone;
          this.companyDetail.followStatus = response.data.followStatus;
          this.companyDetail.cluesSources = response.data.cluesSources;
          this.companyDetail.head = response.data.head;
          this.companyDetail.deptId = response.data.deptId;
          this.companyDetail.deptName = response.data.deptName;
          this.companyDetail.formerHead = response.data.formerHead;
          this.companyDetail.formerDeptId = response.data.formerDeptId;
          this.companyDetail.formerDeptName = response.data.formerDeptName;
          this.companyDetail.latestFollowRecords = response.data.latestFollowRecords;
          this.companyDetail.realityFollowRecords = response.data.realityFollowRecords;
          this.companyDetail.notFollowDays = response.data.notFollowDays;
          this.companyDetail.nextFollowTime = response.data.nextFollowTime;
          this.companyDetail.channel = response.data.channel;
          this.companyDetail.transferCustomerTime = response.data.transferCustomerTime;
          this.companyDetail.lastCallTime = response.data.lastCallTime;
          this.companyDetail.createBy = response.data.createBy;
          this.companyDetail.createTime = response.data.createTime;
          this.companyDetail.updateBy = response.data.updateBy;
          this.companyDetail.updateTime = response.data.updateTime;
          this.dataList = Array.from(response.data.crmClueTimeLineVos);
          if (response.data.isDeleted == "1") {
            this.showTransferCluePool = 0;
            this.showTransferCustomer = 0;
          }
          //默认加载第一个tab页
          this.pbSel('first');
          this.loading = false
        });
      } else {
        console.info("==========================");
      };
    },
    getBusinessDicts() {
      this.getDicts("business_customer_label").then(response => {
        let businessCustomerLabelData = response.data;
        for (var i=0;i<businessCustomerLabelData.length;i++){ 
            if(businessCustomerLabelData[i].dictLabel == '全部') {
              this.customerLabelData.push({name:businessCustomerLabelData[i].dictLabel,checked:'1'});
            } else {
              this.customerLabelData.push({name:businessCustomerLabelData[i].dictLabel,checked:'0'});
            }
        }
      });
      this.getDicts("business_customer_followstatus").then(response => {
        let businessCustomerFollowstatusData = response.data;
        for (var i=0;i<businessCustomerFollowstatusData.length;i++){ 
            if(businessCustomerFollowstatusData[i].dictLabel == '全部' || businessCustomerFollowstatusData[i].dictLabel == '(空白)') {
              //this.customerfollowstatusData.push({name:businessCustomerFollowstatusData[i].dictLabel,checked:'1'});
            } else {
              this.customerfollowstatusData.push({name:businessCustomerFollowstatusData[i].dictLabel,checked:'0'});
            }
        }
      });	
      this.getDicts("business_customer_type").then(response => {
        let businessCustomerTypeData = response.data;
        debugger;
        for (var i=0;i<businessCustomerTypeData.length;i++){ 
            if(businessCustomerTypeData[i].dictLabel == '全部' || businessCustomerTypeData[i].dictLabel == '(空白)') {
              //this.customerTypeData.push({name:businessCustomerTypeData[i].dictLabel,checked:'1'});
            } else {
              this.customerTypeData.push({name:businessCustomerTypeData[i].dictLabel,checked:'0'});
            }
        }
      });	
      this.getDicts("business_customer_sources").then(response => {
        let businessCustomerSourceData = response.data;
        for (var i=0;i<businessCustomerSourceData.length;i++){ 
            if(businessCustomerSourceData[i].dictLabel == '全部' || businessCustomerSourceData[i].dictLabel == '(空白)') {
              //this.customersourcesData.push({name:businessCustomerSourceData[i].dictLabel,checked:'1'});
            } else {
              this.customersourcesData.push({name:businessCustomerSourceData[i].dictLabel,checked:'0'});
            }
        }
      });
      this.getDicts("business_customer_industry").then(response => {
        let businessCustomerindustryDataData = response.data;
        for (var i=0;i<businessCustomerindustryDataData.length;i++){ 
            if(businessCustomerindustryDataData[i].dictLabel == '全部' || businessCustomerindustryDataData[i].dictLabel == '(空白)') {
              //this.customerindustryData.push({name:businessCustomerindustryDataData[i].dictLabel,checked:'1'});
            } else {
              this.customerindustryData.push({name:businessCustomerindustryDataData[i].dictLabel,checked:'0'});
            }
        }
      });	
    },
    pbSel(name) {
      debugger;
      let row = {};
      if (name =="first"){
        row = this.getClueInfo;
      }else if (name =="second"){
        row = this.getElectricAalesFlowList;
      }else if (name =="third"){
        row = this.pagingFile;
      }else if (name =="five") {
        row = this.getOperateLogList;
      }
      row.type = name;
      row.id = this.global;
      this.checkDetails(row);
    },
    electricAalesFlowIndex(index) {
      return index + this.electricAalesFlowTotal * (this.getElectricAalesFlowList.pageNum - 1) + 1;
    },
    operateLogIndex(index) {
      return index + this.operateLogTotal * (this.getOperateLogList.pageNum - 1) + 1;
    },
    checkDetails(row) {
      console.info(row.type)
      if (row.type == "first") { // 默认选择第一个tabs页 查询基础信息
        var params = {  // 传递的参数
          contractManageId:this.companyDetail.id,
          type:row.type,
          // 一共有多少条数据
          pageNum: row.pageNum,
          // 一页多少数据
          pageSize: row.pageSize,
        }
        getClueBaseInfo(params.contractManageId).then(response => { //获取线索基本信息
          this.companyDetail.id = response.data.id;
          this.companyDetail.name = response.data.name;
          this.companyDetail.comName = response.data.comName;
          this.companyDetail.phone = response.data.phone;
          this.companyDetail.followStatus = response.data.followStatus;
          this.companyDetail.cluesSources = response.data.cluesSources;
          this.companyDetail.head = response.data.head;
          this.companyDetail.dept = response.data.dept;
          this.companyDetail.formerHead = response.data.formerHead;
          this.companyDetail.formerDept = response.data.formerDept;
          this.companyDetail.latestFollowRecords = response.data.latestFollowRecords;
          this.companyDetail.realityFollowRecords = response.data.realityFollowRecords;
          this.companyDetail.notFollowDays = response.data.notFollowDays;
          this.companyDetail.nextFollowTime = response.data.nextFollowTime;
          this.companyDetail.channel = response.data.channel;
          this.companyDetail.transferCustomerTime = response.data.transferCustomerTime;
          this.companyDetail.lastCallTime = response.data.lastCallTime;
          this.companyDetail.createBy = response.data.createBy;
          this.companyDetail.createTime = response.data.createTime;
          this.companyDetail.updateBy = response.data.updateBy;
          this.companyDetail.updateTime = response.data.updateTime;
          this.dataList = Array.from(response.data.crmClueTimeLineVos);
        });
      } else if (row.type == "second") {
        var params = {
          clueId: this.companyDetail.id,
          flowType:'sales_flow',
          type:row.type,
          // 一共有多少条数据
          pageNum: row.pageNum,
          // 一页多少数据
          pageSize: row.pageSize,
        }
        getListElectricAalesFlowList(params).then(response => {
          this.electricAalesFlowList = response.rows;
          this.electricAalesFlow = response.total;
        });
      } else if (row.type == "third") {
        var params = {
          clueId: this.companyDetail.id,
          flowType:'sales_flow',
          type:row.type,
          // 一共有多少条数据
          pageNum: row.pageNum,
          // 一页多少数据
          pageSize: row.pageSize,
        }
        getListOperateLogList(params).then(response => {
          this.operateLogList = response.rows;
          this.pagingFileTotal = response.total;
          for (var i = 0; i < this.operateLogList.length; i++) {
            var str = this.operateLogList[i].url
            //var nstr = str.split('/')
            this.operateLogList[i].remark = str // 将分割好后的字符给到集合中的remark
          }
        });
      } else if (row.type == "five") {
        var params = {
          clueId: this.companyDetail.id,
          flowType:'operate_log',
          type:row.type,
          // 一共有多少条数据
          pageNum: row.pageNum,
          // 一页多少数据
          pageSize: row.pageSize,
        }
        getListOperateLogList(params).then(response => {
          this.operateLogList = response.rows;
          this.operateLogTotal = response.total;
          for (var i = 0; i < this.operateLogList.length; i++) {
            var str = this.operateLogList[i].url
            //var nstr = str.split('/')
            this.operateLogList[i].remark = str // 将分割好后的字符给到集合中的remark
          }
        });
      }
      this.global = row.id
      this.loading = false
    },
    reset() {
      this.form = {
        id: undefined,
        name: undefined,
        comName: undefined,
        type: undefined,
        phone: undefined,
        industry: undefined,
        followStatus: undefined,
        customerSources: undefined
      };
      this.resetForm("form");
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
        /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.buttonLoading = true;
          clueTransferCustomer(this.form).then(response => {
            this.$modal.msgSuccess("转客户成功");
            this.open = false;
            this.showTransferCluePool = 0;
            this.showTransferCustomer = 0;
          }).finally(() => {
            this.buttonLoading = false;
          });
        }
      });
    },
    /** 转客户按钮操作 */
    transferToCustomer() {
      let name = this.companyDetail.name;
      let phone = this.companyDetail.phone;
      getCustomerByNameAndPhone(name, phone).then(response => { //获取线索基本信息
          if (response.data == null) {
            this.reset();
            this.form.id = this.companyDetail.id;
            this.form.comName = this.companyDetail.comName;
            this.form.name = this.companyDetail.name;
            this.form.phone = this.companyDetail.phone;
            this.open = true;
            this.title = "线索转客户";
          } else {
            this.$modal.msgError("该客户在客户列表已存在!");
          }
      });
    },
    transferCluePool() {
      debugger;
      let name = this.companyDetail.name;
      let phone = this.companyDetail.phone;
      getCluePoolByNameAndPhone(name, phone).then(response => { //获取线索基本信息
        if (response.data == null) {
          let data = '{"ids":"' + this.companyDetail.id + '"}';
          this.$modal.confirm('是否确认转移线索编号为"' + this.companyDetail.id + '"的数据项至线索池？').then(() => {
            this.loading = true;
            return transferClueToCluePool(data);
          }).then(() => {
            debugger;
            this.$modal.msgSuccess("转移成功");
            this.showTransferCluePool = 0;
            this.showTransferCustomer = 0;
          }).catch(() => {
            console.error("转线索池失败!");
          }).finally(() => {
            console.info("转移线索池成功!");
          });
        } else {
          this.$modal.msgError("该线索在线索池列表已存在!");
        }
      });
    },
    selectMethodType(e) {
      this.form.type = e;
      console.log('改变了', e)
    },
    selectMethodFollowStatus(e) {
      this.form.followStatus = e;
      console.log('改变了', e)
    },
    selectMethodCustomerSources(e) {
      this.form.customerSources = e;
      console.log('改变了', e)
    },
    selectMethodIndustry(e) {
      this.form.industry = e;
      console.log('改变了', e)
    },
  }
};
</script>

<style lang="scss" scoped>
  .app-container-left {
    width:50%;
    float: left;
  }
  .app-container-right {
    width:50%;
    float: left;
  }
	.detail-container {
		position: relative;
		padding: 20px;
	}
  .flex-row {
    padding: 8px;
    background:back;
  }
	.back-icon {
		position: absolute;
		left: -40px;
		cursor: pointer;
	}
  .el-divider {
    background-color: #b6d7fb;
  }
	.icon1 {
		width: 14px;
		height: 14px;
		margin-right: 5px;
	}
	.table-box {
		width: 100%;
		border-collapse: collapse;
		border: 1px solid #eee;

		tr,
		td {
			border: 1px solid #eee;
		}
		td {
			padding: 8px;
			font-size: 14px;
		}
		.t-title {
			width: 136px;
			background-color: #f7f9ff;
		}
	}
  .text-info {
    padding-left: 5px;
    color: #666;
  }
  .company_name_detail {
    font-weight: 1000;
    float:left;
  }

  .text-comname {
    font-size:24px;
    height:60px;
    line-height:60px;
    margin-left:10px;
  }
  .company_status {
    margin-left:10px;
    margin-top:18px;
  }
  .unlock {
    float:right;
    margin-right:10px;
  } 
  .export {
    float:right;
    margin-right:10px;
  }
  .addmycus {
    float:right;
    margin-right:10px;
  }
</style>
